/**************************************************************************************** Import */
import _ from 'lodash';
import React, {Component} from 'react';
import { TextInput, View, Dimensions, TouchableHighlight, StyleSheet } from 'react-native';
import { Icon,  List, Button, InputItem, Tabs, TextareaItem, DatePicker, Accordion } from 'antd-mobile-rn';
import Picker from 'react-native-picker';
import { CAround, CBetween, CCenter, CColumn, CFloat, CHand, CItemX, CItemY, CLine, CLoad, CRow, CWrap, CBone, CIcon, CImage, CSvg, CText, CFull, CScroll, CFooter, CHeader, CPage, CButton, CLabel, PTabbar, PHeader } from '../../../../library/comp';
import { Dialog, Http, PageBase } from '../../../../library/func';
import Design from '../../../../design';
import Config from '../../../../config';

/**************************************************************************************** Pageload */

/**************************************************************************************** Cacheload */

/**************************************************************************************** Preload */

/**************************************************************************************** Get */

/**************************************************************************************** Post */

/**************************************************************************************** Page */
export default class House extends PageBase {
	constructor(props) {
        super(props);
		this.state = {
            //VercodeCText
			VercodeTime:120,
			VercodeCText:"获取验证码",
			VercodeActive:true,

            //姓名
            name:'',
            code:'',

            // 身份picker的变量
            family:[
                {label:'家属',value:'家属'},
                {label:'户主',value:'户主'},
                {label:'租客',value:'租客'}
            ],
            // 身份选择时更改的value
            familyvalue:[],

            //小区默认值  默认值
            buildinglist:[
                {label:'珑城花园',value:'珑城花园'},
                {label:'珑城花园1',value:'珑城花园1'},
            ],            

            buildingvalue:['珑城花园'],

            //房屋和单元  数组
            unitroomlist:[],

            //房屋和单元  默认值
            unitroomval:[],


            //自己的手机号  户主需要
            selfmobile:"",

            //户主的手机号  自己需要
            housematermobile:"",

		};
    }

    /************************************************************************************ Life */
    componentDidMount(){


        //获取 单元房子的数组
        // HttpTemp.get({
        //     url:"/CPage/house/getunithouse.php",
        //     data:{
        //         fk_subdistrict_id:1,
        //     },
        //     success:(res) => {
        //         let data = res.data;
        //         for(var key in data){
        //             data[key]['label'] = data[key]['set_name'];
        //             data[key]['value'] = data[key]['id'];
        //             let house = data[key]['house'];

        //             for(var hkey in house){
        //                 house[hkey]['label'] = house[hkey]['set_name'];
        //                 house[hkey]['value'] =  house[hkey]['id'];
        //             }

        //             data[key]['children'] = house;
        //         }
        //         this.setState({
        //             unitroomlist:data
        //         })

        //         console.log(data);

        //     }
        // })

        // //获取自己的手机号码
        // HttpTemp.get({
        //     url:"/CPage/user/detail.php",
        //     success:(res) => {
        //         let data = res.data;
        //         this.setState({
        //             selfmobile:data.set_mobile
        //         });    
        //     }
        // })
    }

    //获取户主信息
    getHousemaster = (id)=>{
        //获取户主的手机号
        // let that = this;
        // HttpTemp.get({
        //     url:"/CPage/myhouse/gethost.php",
        //     data:{
        //         id: id
        //     },
        //     success:(res) => {
        //         console.log(res);
        //         let data = res.data;
        //         this.setState({
        //             housematermobile:data.set_mobile
        //         });    
        //     },
        //     error: {
        //         code: (res)=> {
        //             that.setState({
        //                 housematermobile:""
        //             })    
        //             Dialog.text(res.msg, 1);
        //         }
        //     }
        // })

    }


	/**
	 * 点击获取验证码
	 */
	getVerCode = ()=>{

		let time = this.state.VercodeTime;
		let CText = this.state.VercodeCText;
		let time_time = "秒后重发";

		if(this.state.VercodeActive){
			//发送短信接口
			this.setState({
				VercodeTime:time,
				VercodeCText:time + time_time,
				VercodeActive:false,
			})

            // HttpTemp.post({

            //     url:"/CPage/myhouse/logic/sendmsg.php",
            //     data:{
            //         set_mobile:this.state.housematermobile
            //     },
            //     success:(res) => {
            //         Dialog.text('成功发送验证码', 1);
            //     },
            //     error: {
            //         code: (res)=> {
            //             Dialog.text(res.msg, 1);
            //         }
            //     }
    
            // })
    


			Runtime = ()=>{
				setTimeout(()=>{
					if(this.state.VercodeTime > 1){
						this.setState({
							VercodeTime:this.state.VercodeTime - 1,
							VercodeCText:this.state.VercodeTime - 1 + time_time,
							VercodeActive:false,
						})
						Runtime();	
					}else{
						this.setState({
							VercodeTime:time,
							VercodeCText:CText,
							VercodeActive:true,
						})	
					}	
				},1000);		
			}
			Runtime();
		}
    }
    

    submitInfo(){

        if(this.state.unitroomval.length == 0){
            Dialog.text('请选择楼栋房号', 1);
            return;
        }
        if(this.state.familyvalue.length == 0){
            Dialog.text('请选择身份', 1);
            return;
        }
        if(this.state.familyvalue.length == 0){
            Dialog.text('请选择身份', 1);
            return;
        }

        if(this.state.name == ""){
            Dialog.text('请选填写姓名', 1);
            return;
        }


        let data = {
            fk_house_id: this.state.unitroomval[1],
            enum_apply_status:this.state.familyvalue[0],
            set_apply_name:this.state.name,
        };
        if(this.state.familyvalue[0] == "家属" && this.state.familyvalue[0] == "租客"){
            if(this.state.code == ""){
                Dialog.text('请选填验证码', 1);
                return;
            }
    
            data['set_mobile'] = this.state.housematermobile;
            data['code'] = this.state.code;
        }   

        // HttpTemp.post({

        //     url:"/CPage/myhouse/logic/apply.php",
        //     data:data,
        //     success:(res) => {
        //         Dialog.text("已提交申请", 1);
        //         this.nav.navigate('UserSettingHouse');
        //     },
        //     error: {
        //         code: (res)=> {
        //             Dialog.text(res.msg, 1);
        //         }
        //     }

        // })
    }

    /**
     * 选择身份晚上时单击确定按钮出发的事件
     */
    identity = (value)=>{
        this.setState({
            value:value
        })
    }

	/************************************************************************************ Render */
	render() {
		return (
			<CPage>

                {/* 内容部分 */}
				<CScroll mt='96' bg='#efeff4' >

                    {/* 房屋信息 */}
                    <CRow y='center' pa='20'>
                        <CText color="#999" size='28'>房屋信息</CText>
                    </CRow>

                    {/* 房屋认证所需内容 */}
                    <CColumn bg='#fff' mb='20' mx='20' ra='8' oh px='30'>
                        {/* 选择小区 */}
                        <CRow bb='2 #f0f0f0' py='20' h='80' y='center' f='0'>
                            <CText color='#797979' size='26' h='60' lh='60' w='135' df>小区</CText>
                            <CItemX f='1' x='right' y='center'>
                                <CText color='#333' size='26' mr='20'>珑城花园</CText>
                                <CIcon icon={ Design.icon["make-right"] } w='26' h='26' color="#797979"></CIcon>
                            </CItemX>
                        </CRow>
                        <CRow bb='2 #f0f0f0' py='20' h='80' y='center' f='0'>
                            <CText color='#797979' size='26' h='60' lh='60' w='135' df>楼栋房号</CText>
                            <CItemX f='1' x='right' y='center'>
                                <CText color='#333' size='26' mr='20'>请输入楼栋房号</CText>
                                <CIcon icon={ Design.icon["make-right"] } w='26' h='26' color="#797979"></CIcon>
                            </CItemX>
                        </CRow>
                        <CRow bb='2 #f0f0f0' py='20' h='80' y='center' f='0'>
                            <CText color='#797979' size='26' h='60' lh='60' w='135' df>身份</CText>
                            <CItemX f='1' x='right' y='center'>
                                <CText color='#333' size='26' mr='20'>请选择身份</CText>
                                <CIcon icon={ Design.icon["make-right"] } w='26' h='26' color="#797979"></CIcon>
                            </CItemX>
                        </CRow>

                        {/* <List style={{ height:50, justifyContent:"center",paddingTop:10,marginTop:-10,width:Config.map.screen.width-40,backgroundColor:'#fff' }}>
                            <Picker
                                data={this.state.buildinglist}
                                value={this.state.buildingvalue}
                                cols={1}
                                onChange={(val)=>{
                                }}
                                itemStyle={{fontSize: 14,height:30,lineHeight:30}}
                                style={{
                                    borderWidth:0,borderColor:'transparent'
                                }}
                            >
                                <List.Item arrow="horizontal" last>
                                    <CText size='28' color='#797979' h='60' lh='60' style={{marginLeft:-5}}>小区</CText>
                                </List.Item>
                            </Picker> 
                        </List> */}

                        {/* 选择楼栋和房号 */}

                        {/* <List style={{ height:50, justifyContent:"center",paddingTop:10,marginTop:-10,width:Config.map.screen.width-40,backgroundColor:'#fff' }}>
                            <Picker
                                data={this.state.unitroomlist}
                                value={this.state.unitroomval}
                                cols={2}
                                onChange={(val)=>{
                                    val[1] = parseInt(val[1]);
                                    this.setState({
                                        unitroomval:val
                                    })
                                    this.getHousemaster(val[1]);
                                }}
                                itemStyle={{fontSize: 14,height:30,lineHeight:30}}
                                style={{
                                    borderWidth:0,borderColor:'transparent'
                                }}
                            >
                                <List.Item arrow="horizontal" last>
                                    <CText size='28' color='#797979' h='60' lh='60' style={{marginLeft:-5}}>楼栋房号</CText>
                                </List.Item>
                            </Picker> 
                        </List> */}

                        {/* <List style={{ height:50, justifyContent:"center",paddingTop:10,marginTop:-10,width:Config.map.screen.width-40,backgroundColor:'#fff' }}>
                            <Picker
                                data={this.state.family}
                                value={this.state.familyvalue}
                                cols={1}
                                onChange={(val)=>{
                                    this.setState({
                                        familyvalue:val
                                    })
                                }}
                                itemStyle={{fontSize: 14,height:30,lineHeight:30}}
                                style={{
                                    borderWidth:0,borderColor:'transparent'
                                }}
                            >
                                <List.Item arrow="horizontal" last>
                                    <CText size='28' color='#797979' h='60' lh='60' style={{marginLeft:-5}}>身份</CText>
                                </List.Item>
                            </Picker> 
                        </List> */}

                    </CColumn>
                    
                    {/* 个人信息标题 */}
                    <CRow y='center' pa='20'>
                        <CText color="#999" size='28'>个人信息</CText>
                    </CRow>

                    {/* 个人信息所需内容 */}
                    <CColumn bg='#fff' mb='20' mx='20' ra='8'>

                        {/* 真实姓名 */}
                        <CRow mx='20' bb='2 #f0f0f0' px='20' h='100' y='center'>
                            <CBetween>
                                <CHand y='center'>
                                    <CText size='28' color='#797979'>姓名</CText>
                                </CHand>
                                <CHand y='center'>
                                    <TextInput
                                        placeholder='请输入您的真实姓名'
                                        underlineColorAndroid='transparent'
                                        defaultValue={this.state.name}
                                        style={{width:160, fontSize:14, textAlign:"right"}}
                                        onChangeCText={(val)=>{
                                            this.setState({
                                                name:val
                                            })
                                        }}
                                    />
                                </CHand>
                            </CBetween>
                        </CRow>

                        <CRow mx='20' px='20' h='100' y='center'>
                            <CBetween>
                                <CHand y='center'>
                                    <CText size='28' color='#797979'>手机号码</CText>
                                </CHand>
                                <CHand y='center'>
                                    <CText size='28'>{this.state.selfmobile}</CText>
                                </CHand>
                            </CBetween>
                        </CRow>

                        <CRow mx='20' px='20' h='100' y='center'>
                            <CBetween>
                                <CHand y='center'>
                                    <CText size='28' color='#797979'>户主手机号码</CText>
                                </CHand>
                                <CHand y='center'>
                                    <CText size='28'>{this.state.housematermobile}</CText>
                                </CHand>
                            </CBetween>
                        </CRow>

                        <CRow mx='20' px='20' h='100' y='center'>
                            <CBetween>
                                <CHand y='center' 
                                >
                                    <TextInput
                                    defaultValue={this.state.code}
                                    onChangeCText = {(val)=>{
                                        this.setState({
                                            code:val
                                        })
                                    }}
                                    placeholder='请输入验证码' underlineColorAndroid='transparent' style={{width:160, fontSize:14, CTextAlign:"left"}}></TextInput>
                                </CHand>
                                <CHand y='center'
                                    style={{
                                        borderWidth:1,
                                        borderColor:'#0c6',
                                        height:26,
                                        paddingLeft:6,
                                        paddingRight:6,
                                        borderRadius:5
                                    }}
                                    onPress={e=>this.getVerCode()}
                                >
                                    <CText style={{fontSize:12,color:'#0c6'}}>{this.state.VercodeCText}</CText>
                                </CHand>
                            </CBetween>
                        </CRow>

                    </CColumn>
                    
                    {/* 提交按钮 */}
                    <CColumn py='10' mt='20' px='30'>
                        <CButton {...Design.global.commonButton} ra='10' onPress={e=>this.submitInfo()}>提交</CButton>
                    </CColumn>

				</CScroll>
				
                {/* header */}
				<PHeader nav={this.nav}>房屋认证</PHeader>
                
			</CPage>
		);
	}
}